<template>
  <div class="tabbar">
    <van-tabbar v-model="active" route active-color="#079f40" fixed placeholder>
      <van-tabbar-item v-for="route in tabbarRoutes" 
      :key="route.path"
      :to="route.path"
      :badge="route.path==='/cart'?store.totalAmount===0?'':store.totalAmount:''"
      :icon="route.meta.icon">{{route.meta.title}}</van-tabbar-item>

    </van-tabbar>
  </div>
</template>

<script setup>
import { computed,ref } from 'vue';
import useCartStore from '../../store/cart'
import routes from '@/router/routes'
import {useRoute} from 'vue-router'
const route = useRoute()

// const adr = route.path + '1' 

const store = useCartStore()
const tabbarRoutes = computed(()=> routes.filter(route=>route.meta?.inMenu))
// console.log(tabbarRoutes.value)
const active = ref(0);
</script>

<style  scoped>

</style>
